博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
加载静态文件,父模板的继承和扩展
阅读量:5937 次
发布时间:2019-06-19

本文共 5083 字,大约阅读时间需要 16 分钟。

  1. 用url_for加载静态文件
    1. <script src="{
      { url_for('static',filename='js/login.js') }}"></script>
    2. flask 从static文件夹开始寻找
    3. 可用于加载css, js, image文件
  2. 继承和扩展
    1. 把一些公共的代码放在父模板中,避免每个模板写同样的内容。base.html
    2. 子模板继承父模板
      1.   {% extends 'base.html’ %}
    3. 父模板提前定义好子模板可以实现一些自己需求的位置及名称。block
      1. <title>{% block title %}{% endblock %}-MIS问答平台</title>
      2. {% block head %}{% endblock %}
      3. {% block main %}{% endblock %}
    4. 子模板中写代码实现自己的需求。block
      1.   {% block title %}登录{% endblock %}
  3. 首页、登录页、注册页都按上述步骤改写。

 

from flask import Flask,render_templateapp = Flask(__name__)@app.route('/')def shouye():    return render_template('shouye.html')@app.route('/denglu/')def denglu():    return render_template('denglu.html')@app.route('/zhuce/')def zhuce():    return render_template('zhuce.html')if __name__ == '__main__':    app.run()
    
{% block title %} 爱奇艺 {% endblock %}
{% block js %}{% endblock %}

{% block jiemian %}
推荐
{% endblock %}
{% extends'shouye.html' %}{% block title %}用户登录{% endblock %}{% block js %} {% endblock %}{% block jiemian %}
用户名
密码
普通用户
VIP用户
{% endblock %}
{% extends'shouye.html' %}{% block title %}用户注册{% endblock %}{% block js %} {% endblock %}{% block jiemian %}
用户昵称
输入密码
确认密码
普通用户
VIP用户
{% endblock %}
function myLogin() {
var one=document.getElementById("un"); var two=document.getElementById("pw"); var three=document.getElementById("error_box"); var four=document.getElementById("tpw"); if(two.value.length<6){ three.innerHTML="为了账号安全,请输入6个以上的密码!"; return } else if((one.value.charCodeAt(0)>=48)&&one.value.charCodeAt(0)<=57){
three.innerHTML="账号首个不能为数字!"; return } else if (two.value!=four.value){
three.innerHTML="输入密码不一致!请重新输入!"; return } else for(var i=1;i
57)&&(one.value.charCodeAt(i)<97||one.value.charCodeAt(i)>122)){ three.innerHTML="账号只能为数字!"; return } } if(one.value.length<6){
three.innerHTML="账号需为6-12个长度!"; return } window.alert("登录成功!") }
function myLogin() {            var one=document.getElementById("un");            var two=document.getElementById("pw");            var three=document.getElementById("error_box");            if(two.value.length<6){                three.innerHTML="为了账号安全,请输入6个以上的密码!";                return            }              else if((one.value.charCodeAt(0)>=48)&&one.value.charCodeAt(0)<=57){                three.innerHTML="账号首个不能为数字!";                return            }            else for(var i=1;i
57)&&(one.value.charCodeAt(i)<97||one.value.charCodeAt(i)>122)){ three.innerHTML="账号只能为数字!"; return } } if(one.value.length<6){ three.innerHTML="账号需为6-12个长度!"; return } window.alert("登录成功!") }
img{
width: 300px; height: 200px;}.img{
border:1px solid skyblue; width: 300px; height: 250px; float: left; margin: 5px;}.img img{
width:100%; height: 85%;}.desc{
text-align:center; padding: 5px;}.img:hover{
border: 1px solid blue;}p{
color:fuchsia;}.kk{
color:darkcyan;font-weight: bold;font-style: italic;font-size: 20px;}#abc{
color: darkblue;text-decoration: underline;font-size: 25px;}.aaa img{
height:50px; width:50px;}

 

转载于:https://www.cnblogs.com/1996liuda/p/7798276.html

你可能感兴趣的文章
iBeacon技术
查看>>
mac环境下配置nginx
查看>>
const与volatile
查看>>
电脑出现 flash update failed 解决方法
查看>>
【matlab】matalb生成dll给Cpp用
查看>>
《线性代数习题集》 Chapter 1_Determinants_Sec.1.Second-and Third-Order Determinants
查看>>
陶哲轩实分析 命题7.2.5 证明
查看>>
destoon复制新模块的方法
查看>>
【百度地图API】如何制作班级地理通讯录?LBS通讯录
查看>>
第二周作业
查看>>
构建之法阅读笔记之三
查看>>
LWIP2.0.2 & FreeRTOS & MQTT 客户端的 使用
查看>>
【状压dp】AC Challenge
查看>>
如何弹出一个模式窗口来显示进度条 .
查看>>
Android Error:Could not find lottie.jar
查看>>
python 修行之路(1-自我介绍及python环境的搭建)
查看>>
cdoj 1328 卿学姐与诡异村庄 Label:并查集 || 二分图染色
查看>>
spring冲刺第九天
查看>>
【待续】C#.Net 关键词清理 Fields Property Attribute Const三者之间的区别与联系
查看>>
MySQL 用户与授权管理详解
查看>>